/*
 *  This file is part of Moeditor.
 *
 *  Copyright (c) 2016 Menci <huanghaorui301@gmail.com>
 *
 *  Moeditor is free software: you can redistribute it and/or modify
 *  it under the terms of the GNU General Public License as published by
 *  the Free Software Foundation, either version 3 of the License, or
 *  (at your option) any later version.
 *
 *  Moeditor is distributed in the hope that it will be useful,
 *  but WITHOUT ANY WARRANTY; without even the implied warranty of
 *  MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE.  See the
 *  GNU General Public License for more details.
 *
 *  You should have received a copy of the GNU General Public License
 *  along with Moeditor. If not, see <http://www.gnu.org/licenses/>.
 */

html {
    width: calc(100% - 2px);
    height: calc(100% - 2px);
    overflow: hidden;
    border: 1px solid #d2d2d2;
}

body {
    background-color: #fbfbfb;
    margin: 0;
    -webkit-user-select: none;
    cursor: default;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

#main {
    margin-top: 40px;
    width: 100%;
    height: 100%;
}

.placeholder {
    vertical-align: bottom;
    text-align: center;
    color: #666;
    font-size: 13px;
    font-family: Roboto, Helvetica, 'Segoe UI', Arial, sans-serif;
    height: 100%;
    line-height: 260px;
}

.panel {
    padding: 20px;
    color: #666;
    font-family: Roboto, Helvetica, 'Segoe UI', Arial, sans-serif;
    letter-spacing: 0.5px;
    font-size: 13.33333px;
}

.panel tr {
    height: 40px;
}

.panel tr td {
    white-space: nowrap;
}

select, input {
    background-color: transparent;
    border: 1px solid #ddd;
    outline: none;
    height: 25px;
    width: 100%;
    font-family: Roboto, Helvetica, 'Segoe UI', Arial, sans-serif;
    color: #666;
    box-sizing: border-box;
}

input[type=checkbox] {
    height: initial;
    width: initial;
    vertical-align: middle;
}

select:hover, input:hover, select:active, input:active {
    border: 1px solid #bbb;
}

button.button-add-remove {
    background: #fbfbfb;
    border: 1px solid #ddd;
    height: 25px;
    width: 25px;
    font-size: 9px;
    vertical-align: top;
    color: #666;
    outline: none;
}

button.button-add-remove[disabled] {
    color: #aaa;
}

button.button-add-remove:not([disabled]):hover {
    border-color: #bbb;
}

select[data-key="render-theme"] ~ button.button-add-remove:not([disabled]):hover ~ button.button-add-remove,
select[data-key="render-theme"]:hover ~ button.button-add,
select#custom-csss:hover ~ div button.button-add-remove
{
    border-left-color: #bbb;
}

select#custom-csss ~ div button.button-add-remove:not([disabled]):hover ~ button.button-add-remove {
    border-top-color: #bbb;
}

button.button-add-remove:not([disabled]):active {
    background-color: #efefef;
}

input {
    padding-left: 3px;
}

html.darwin input {
    padding-left: 7px;
    border-radius: 5px;
}

option.builtin{
    background-color: #eee;
}

option.invalidFile {
    color: red;
}

span.checkbtn{
    width: 15px;
    display: inline-block;
}

input[data-key="scale-factor"]::-webkit-outer-spin-button,
input[data-key="scale-factor"]::-webkit-inner-spin-button {
    -webkit-appearance: none !important;
}